<template>
    <view class="goods-list">
         <!-- 为 my-goods 组件动态绑定 goods 属性的值 -->
      <my-goods :goods="item" v-for="(item, i) in goodsList" :key="i" @click.native="gotoDetail(item)"></my-goods>
     </view>
</template>

<script>
    export default {
        data() {
            return {
                // 请求参数对象
                    queryObj: {
                      // 查询关键词
                      query: '',
                      // 商品分类Id
                      cid: '',
                      // 页码值
                      pagenum: 1,
                      // 每页显示多少条数据
                      pagesize: 10
                    },
                    // 商品列表的数据
                        goodsList: [],
                        // 总数量，用来判断数据是否请求完毕
                        total: 0,
                        // 当前数据请求状态
                        isLoading:false
                       
            };
        },
        // options 接收传过来的query参数
        onLoad(options) {
            // console.log(options);
             // 将页面参数保存到 this.queryObj 对象中
              this.queryObj.query = options.query || ''
              this.queryObj.cid = options.cid || ''
            
            this.getGoodsList()
        },
        // 页面触底事件处理函数
        onReachBottom(){
         // console.log('到底了')
         // 判断数据是否加载完毕
         if(this.goodsList.length >= this.total) return
         // 判断数据是否加载完毕
         if(this.isLoading) return
         this.queryObj.pagenum = this.queryObj.pagenum + 1
         // 重新渲染页面
         this.getGoodsList()
        },
        // 下拉刷新数据事件处理函数
        onPullDownRefresh() {
            console.log('下拉刷新');
            this.queryObj.pagenum = 1
            this.goodsList = []
            this.total = 0
            this.isLoading = false
            // 数据重新渲染完毕之后,关闭下拉刷新的效果
            this.getGoodsList(() => {
				console.log('关闭下拉刷新效果')
				uni.stopPullDownRefresh()
			})
            
        },
        methods:{
            // 点击item跳转到商品详情页
            gotoDetail(goods){
                uni.navigateTo({
                    url: '/subpkg/goods_detail/goods_detail?goods_id=' + goods.goods_id
                  })
            },
          async  getGoodsList(cb){
              // 页面刷新状态
              this.isLoading = true
                const {data:res} = await uni.$http.get('/goods/search',this.queryObj)
                // console.log(res);
                if(cb) {
                    cb()
                }
                if (res.meta.status !== 200) return uni.$showMsg()
                this.isLoading = false
                    // 为数据赋值
                // this.goodsList = res.message.goods
                 this.goodsList = [...this.goodsList, ...res.message.goods]
                this.total = res.message.total
            }
            
        }
        
    }
</script>

<style lang="scss">

</style>
